<template>
    <div>
        <section class="menu-block">
            <h2>查看是否登录</h2>
            <div class="menu-block">
                <pre v-highlightA>
                    <code>
import {account} from 'fzHybrid'
...
var result = account.isLogin() //返回数据: true 表示已登录 false 表示未登录
                    </code>
                </pre>
                <van-button size="large" type="primary" @click="isLoginClick">点击查看是否登录</van-button>
                <code>登录结果：{{ isLogin }}</code>
            </div>
        </section>
        <section class="menu-block">
            <h2>获取登录信息</h2>
            <div class="menu-block">
                <pre v-highlightA>
                    <code>
import {account} from 'fzHybrid'
...
var info = account.info() //返回数据: {token:''}
                    </code>
                </pre>
                <van-button size="large" type="primary" @click="infoClick">点击获取登录信息</van-button>
                <code>登录信息：{{ info }}</code>
            </div>
        </section>
        <section class="menu-block">
            <h2>登录</h2>
            <div class="menu-block">
                <pre v-highlightA>
                    <code>
import {account} from 'fzHybrid'
...
account.login(function(info){ //返回数据 info: { 'token': ''}

})
                    </code>
                </pre>
                <van-button size="large" type="primary" @click="loginClick">点击登录</van-button>
                <code>登录结果：{{ loginResult }}</code>
            </div>
        </section>
        <section class="menu-block">
            <h2>登出</h2>
            <div class="menu-block">
                <pre v-highlightA>
                    <code>
import {account} from 'fzHybrid'
...
account.logout(function(info){ //返回数据 info: {'success':true}

})
                    </code>
                </pre>
                <van-button size="large" type="primary" @click="logoutClick">点击登出</van-button>
                <code>登出结果：{{ logoutResult }}</code>
            </div>
        </section>
    </div>
</template>

<script>
import {Button, CellGroup, Cell, Field, Notify, Checkbox} from 'vant'
import { account } from 'MTHybrid'

export default {
    data () {
        return {
            isLogin: '',
            info: '',
            loginResult: '',
            logoutResult: ''
        }
    },
    methods: {
        isLoginClick () {
            this.isLogin = account.isLogin()
        },
        infoClick () {
            this.info = account.info()
        },
        loginClick () {
            var thiz = this
            account.login(function (info) {
                thiz.loginResult = info
            })
        },
        logoutClick () {
            var thiz = this
            account.logout(function (info) {
                thiz.logoutResult = info
            })
        }
    },
    components: {
        [Button.name]: Button,
        [Cell.name]: Cell,
        [CellGroup.name]: CellGroup,
        [Field.name]: Field,
        [Notify.name]: Notify,
        [Checkbox.name]: Checkbox
    }
}
</script>

<style>
    @import '../../../static/css/index.css';
    .menu-block {
        padding: 0 0.2rem
    }
    h2 {
        margin-block-start: 0.83em;
        margin-block-end: 0.83em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
        margin: 0;
        /* font-weight: 200; */
        font-size: 18px;
        color: rgba(69,90,100,.6);
        padding: 20px 15px 15px;
    }
</style>
